{% extends "header.html" %}
{% load static %}
{% block content %}

<div class="container-fluid">
  <div class="row">

    <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
      <h1 class="page-header">
          <div id="myCarousel" class="carousel slide">
              <!-- 轮播（Carousel）指标 -->
              <ol class="carousel-indicators">
                  <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                  <li data-target="#myCarousel" data-slide-to="1"></li>
              </ol>
              <!-- 轮播（Carousel）项目 -->
              <div class="carousel-inner">
                  <div class="item active">
                      <img src="{% static 'img/ICONS/banner-1.png' %}" width="100%" height="20%" alt="邻区自动优化">
{#                      <div class="carousel-caption">标题 1</div>#}
                  </div>
                  <div class="item">
                      <img src="{% static 'img/ICONS/banner-2.png' %}" width="100%" height="20%" alt="加入我们">
{#                      <div class="carousel-caption">标题 2</div>#}
                  </div>
              </div>
              <!-- 轮播（Carousel）导航 -->
              <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
                  <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                  <span class="sr-only">Previous</span>
              </a>
              <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
                  <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                  <span class="sr-only">Next</span>
              </a>
          </div>
      </h1>

{#      <div class="row placeholders">#}
{#        <div class="col-xs-6 col-sm-3 placeholder">#}
{#          <img src="" width="200" height="200" class="img-responsive" alt="Generic placeholder thumbnail">#}
{#          <h4>Label</h4>#}
{#          <span class="text-muted">Something else</span>#}
{#        </div>#}
{#        <div class="col-xs-6 col-sm-3 placeholder">#}
{#          <img src="" width="200" height="200" class="img-responsive" alt="Generic placeholder thumbnail">#}
{#          <h4>Label</h4>#}
{#          <span class="text-muted">Something else</span>#}
{#        </div>#}
{#        <div class="col-xs-6 col-sm-3 placeholder">#}
{#          <img src="" width="200" height="200" class="img-responsive" alt="Generic placeholder thumbnail">#}
{#          <h4>Label</h4>#}
{#          <span class="text-muted">Something else</span>#}
{#        </div>#}
{#        <div class="col-xs-6 col-sm-3 placeholder">#}
{#          <img src="" width="200" height="200" class="img-responsive" alt="Generic placeholder thumbnail">#}
{#          <h4>Label</h4>#}
{#          <span class="text-muted">Something else</span>#}
{#        </div>#}
{#      </div>#}

      <h2 class="sub-header">邻区自动优化工单详情</h2>
      <div class="table-responsive">
        <table id="example" class="table table-striped table-bordered display" cellspacing="0" style="width:100%"> <!-- dataTable格式-->
          <thead>
          <tr>
              <th>本地工单编号</th>
              <th>服保工单编号</th>
              <th>开始日期</th>
              <th>结束日期</th>
              <th>上传服保日期</th>
              <th>管理员批复时间</th>
              <th>脚本完成时间</th>
              <th>工单回复时间</th>
              <th>工单内容</th>
              <th>是否闭环</th>
          </tr>
          </thead>
        <tfoot>
           <tr>
              <th>本地工单编号</th>
              <th>服保工单编号</th>
              <th>开始日期</th>
              <th>结束日期</th>
              <th>上传服保日期</th>
              <th>管理员批复时间</th>
              <th>脚本完成时间</th>
              <th>工单回复时间</th>
              <th>工单内容</th>
              <th>是否闭环</th>
          </tr>
        </tfoot>
          <tbody>
          {% for post in post_list %}
          <tr>
              <td><a href="#">{{ post.local_id}}</a></td>
              <td>{{ post.care_id}}</td>
              <td>{{ post.start_date |date:'Y-m-d'}}</td>
              <td>{{ post.end_date |date:'Y-m-d'}}</td>
              <td>{{ post.upload_date |date:'Y-m-d'}}</td>
              <td>{{ post.admin_reply_date |date:'Y-m-d'}}</td>
              <td>{{ post.finish_date |date:'Y-m-d'}}</td>
              <td>{{ post.order_res_date |date:'Y-m-d'}}</td>
              <td><a href="#">{{ post.content|truncatechars:5}}</a></td>
              <td>
                  {% if post.circle_flag == '0' %}
                  <a href="#">未闭环</a>
                  {% else %}
                  闭环
                  {% endif %}
              </td>
          </tr>
          {% endfor %}
          </tbody>
        </table>
      </div>
      </div>
    </div>
  </div>

{% endblock %}